<div ng-controller="Camel.DebugRouteController" ng-switch="debugging">
  <div ng-switch-when="true">
    <div class="row-fluid">
      <div class="span10">
        <div ng-include src="graphView">
        </div>
      </div>
      <div class="span2">
        <div class="btn-toolbar pull-right">
          <div class="btn-group">
            <div ng-switch="hasBreakpoint">
              <button ng-switch-when="true" class="btn" ng-disabled="!selectedDiagramNodeId"
                      ng-click="removeBreakpoint()" title="Remove the breakpoint on the selected node"><i
                      class="icon-remove"></i> Remove breakpoint
              </button>
              <button ng-switch-default="false" class="btn" ng-disabled="!selectedDiagramNodeId"
                      ng-click="addBreakpoint()" title="Add a breakpoint on the selected node"><i class="icon-plus"></i> Add breakpoint
              </button>
            </div>
          </div>
        </div>
        <div class="btn-toolbar pull-right">
          <div class="btn-group">
            <button class="btn" ng-click="step()" ng-disabled="!stopped" title="Step into the next node"><img
                    ng-src="app/camel/img/step.gif"></button>
            <button class="btn" ng-click="resume()" ng-disabled="!stopped" title="Resume running"><img
                    ng-src="app/camel/img/resume.gif"></button>
            <button class="btn" ng-click="suspend()" ng-disabled="stopped"
                    title="Suspend all threads in this route"><img ng-src="app/camel/img/suspend.gif"></button>
          </div>
        </div>
        <div class="btn-toolbar pull-right">
          <div class="btn-group">
            <button class="btn" type="submit" ng-click="stopDebugging()" title="Stops the debugger">Close
            </button> 
          </div>
        </div>
        <div class="span12 well">
          <form>
            <div class="table-header">Breakpoints:</div>
            <ul>
              <li class="table-row" ng-repeat="b in breakpoints">
                {{b}}
              </li>
            </ul>
            <div class="table-row">Suspended:</div>
            <ul>
              <li class="table-row" ng-repeat="b in suspendedBreakpoints">
                {{b}}
              </li>
            </ul>
          </form>
        </div>
      </div>
    </div>

    <div ng-include src="tableView">
    </div>
  </div>
  <div class="span12 well" ng-switch-default="false">
    <form>
      <p>Debugging allows you to step through camel routes to diagnose issues</p>

      <button class="btn btn-info" type="submit" ng-click="startDebugging()">Start debugging</button>
    </form>
  </div>
</div>
